import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Window 2.14
import MyPlayerItem 1.0
import QtQuick.Dialogs 1.2

Window {
    id:root
    visible: true
    width: 640
    height: 480
    title: qsTr("qffplayer")

    property var curTime:"00:00"
    property var duration: 0
    property var curSec:0

    Rectangle{
        id:toolBar
        height: 40
        width: parent.width
        Button {

            id: openBar
            width:60
            height: 40
            contentItem: Text {
                id:openItem
                text: "打开"
                color: "black" // 设置字体颜色为蓝色
                verticalAlignment: Text.AlignVCenter
                horizontalAlignment: Text.AlignHCenter
            }
            background: Rectangle{
                id:openBarBg
            }

            MouseArea {
                hoverEnabled:true
                anchors.fill: parent
                onEntered: {
                    openBarBg.color="gray"
                }
                onExited: {
                    openBarBg.color=toolBar.color
                }

                onClicked: dropdownMenu.open()
            }

            Menu {
                id: dropdownMenu
                y: openBar.height // 将菜单放置在按钮下方
                width: 70
                MenuItem
                {
                    height: 30
                    text: "打开文件"
                    onClicked: {
                        console.log("Option 1 selected")
                        dropdownMenu.close()
                        chooseVideo.open()
                    }
                }
                MenuItem {
                    text: "打开网络"
                    height: 30
                    onClicked: {
                        dropdownMenu.close()
                        var component = Qt.createComponent("openStream.qml");
                        var obj = component.createObject(root);
                    }
                }
            }
        }

        Button{
            id:mediainfo
            x:openBar.width-10
            height: parent.height
            width:60
            font.family: "微软雅黑"
            font.pixelSize: 12

            contentItem: Text {
                text: "媒体"
                color: "black" // 设置字体颜色为蓝色
                verticalAlignment: Text.AlignVCenter
                horizontalAlignment: Text.AlignHCenter
            }

            background: Rectangle{
                id:mediaBtnBg
            }

            MouseArea {
                hoverEnabled:true
                anchors.fill: parent
                onEntered: {
                    mediaBtnBg.color="gray"
                }
                onExited: {
                    mediaBtnBg.color=toolBar.color
                }

                onClicked: {
                    var info = player.getMediaInfo();
                    var component = Qt.createComponent("Mediainfo.qml");
                    var obj = component.createObject(root);
                    obj.resolution = "        分辨率: "+info.resolution
                    obj.vcodec_name = "        视频格式: "+info.vcodec_name
                    obj.frame_rate = "        帧率: "+info.frame_rate
                    obj.v_bit_rate = "        比特率: "+info.v_bit_rate
                    obj.pix_format = "        像素格式: "+info.pix_format+"\r\n"

                    obj.sample_rate = "        采样率: "+info.sample_rate
                    obj.acodec_name = "        音频格式: "+info.acodec_name
                    obj.channel = "        通道数: "+info.channel
                    obj.a_bit_rate = "        比特率: "+info.a_bit_rate
                    obj.sample_bits = "        采样深度: "+info.sample_bits
                }
            }
        }

        Button{
            width: 60
            font.family: "微软雅黑"
            font.pixelSize: 12
            id:filterBtn
            x:mediainfo.x+mediainfo.width-10
            height: 40

            contentItem: Text {
                id:filterItem
                text: "滤镜"
                color: "black" // 设置字体颜色为蓝色
                verticalAlignment: Text.AlignVCenter
                horizontalAlignment: Text.AlignHCenter
            }
            background: Rectangle{
                id:filterBg
            }

            MouseArea {
                hoverEnabled:true
                anchors.fill: parent
                onEntered: {
                    filterBg.color="gray"
                }
                onExited: {
                    filterBg.color=toolBar.color
                }

                onClicked: filterMenu.open()
            }

            Menu {
                id: filterMenu
                y: openBar.height // 将菜单放置在按钮下方
                width: 70
                MenuItem
                {
                    height: 30
                    text: "人脸识别"
                    background: Rectangle{
                        id:faceBg
                    }
                    onTriggered:
                    {
                        if(player.getPlaying() === false)
                            return ;
                        var ret = player.setFaceDetect();
                        if(ret == true)
                            faceBg.color = "lightgreen"
                        else
                            faceBg.color = toolBar.color

                    }
                }
                MenuItem {
                    text: "局部放大"
                    height: 30
                    background: Rectangle{
                        id:scaleBg
                    }
                    onTriggered:
                    {
                        if(player.getPlaying() == false)
                            return
                        var ret =player.setScale()
                        if(ret === -1)
                        {
                            messageDialog.open()

                        }else if(ret == 1){
                            scaleBg.color="lightgreen"
                        }else
                            scaleBg.color = toolBar.color

                    }

                    MessageDialog {
                        id: messageDialog
                        title: "提示"
                        icon: StandardIcon.Critical
                        text: "请先画出矩形框"
                    }
                }

                MenuItem {
                    property var str:""
                    text: "水印"
                    height: 30
                    background: Rectangle{
                        id:watermaskBg
                    }
                    onTriggered: {
                        if(player.getPlaying() == false)
                            return
                        if(str.length == 0){
                            str = "test1221"
                            player.addMask(str);
                            watermaskBg.color = "lightgreen"
                        }else{
                            str = ""
                            player.addMask("");
                            watermaskBg.color = toolBar.color
                        }
                    }
                }

                MenuItem {
                    text: "变形"
                    height: 30
                    background: Rectangle{
                        id:transforBg
                    }
                    onTriggered: {
                        if(player.getPlaying() == false)
                            return
                        if(player.setTransform() == true)
                            transforBg.color = "lightgreen"
                        else
                            transforBg.color = toolBar.color
                    }
                }

                MenuItem {
                    text: "马赛克"
                    height: 30
                    background: Rectangle{
                        id:mosicBg
                    }
                    onTriggered: {
                        if(player.getPlaying() == false)
                            return
                        if(player.addMosic() == true)
                            mosicBg.color = "lightgreen"
                        else
                            mosicBg.color = toolBar.color
                    }
                }

                MenuItem {
                    text: "车牌识别"
                    height: 30
                    background: Rectangle{
                        id:carNoBg
                    }
                    onTriggered: {
                        if(player.getPlaying() == false)
                            return
                        if(player.doCarNO() == true)
                            carNoBg.color = "lightgreen"
                        else
                            carNoBg.color = toolBar.color
                    }
                }
            }
        }
    }

    PlayerItem{
        visible: true
        id:player
        anchors.top: toolBar.bottom
        width: parent.width
        height:parent.height-toolBar.height-bottomrec.height
        fillColor: "black"

        onSetTime2qml: {
            if(flag == 0){
                endtime.text = pts
                slider.to = sec;
                slider.value = 0
            }else if(flag == 1){
                timeLabel.text = pts
                if(slider.isPress == 0)
                    slider.value = sec
                curSec = sec
            }
        }

        onStopPlay2qml:{
            btnStartPlayIcon.source = "image/pause0.png"
            exportIcon.source = "image/record.png"
            curSec = ""
            endtime.text = "00:00:00"
            timeLabel.text="00:00:00"
            console.log("1111:", comboBox.currentIndex)
            comboBox.currentIndex = 0
            console.log("222:", comboBox.currentIndex)
            comboBox.prevIndex = 0
            exportIcon.scale = 1.3;

            playBtn.enabled = true
            comboBox.enabled = true
            slider.value = 0;
            scaleBg.color=toolBar.color
            watermaskBg.color = toolBar.color
            transforBg.color=toolBar.color
            mosicBg.color = toolBar.color
        }

        onIsRealTime2qml:{
            if(isRealtime == true){
                playBtn.enabled = false
                comboBox.enabled = false
            }
        }
    }

    FileDialog {
        id: chooseVideo
        title: qsTr("选择视频文件")
        selectExisting: true
        selectFolder: false
        selectMultiple: false
        nameFilters: [qsTr("Video files(*.mp4 *.flv)"),qsTr("All files(*)")]
        onAccepted: {
            console.log("You chose: " + chooseVideo.fileUrl.toString().substring(8,chooseVideo.fileUrl.length));

            player.startPlay(chooseVideo.fileUrl.toString().substring(8,chooseVideo.fileUrl.length));
            btnStartPlayIcon.source = "image/pause0.png"
        }
        onRejected: {
            console.log("Canceled");
        }
    }

    Rectangle{
        id:bottomrec
        width: root.width
        height:55
        y:toolBar.height+player.height

        Button {

            id:timeLabel
            objectName:"timeButton"
            anchors.bottom:slider.bottom
            width: 70
            height: parent.height/3
            text:curTime
            background: Rectangle{
                anchors.fill: parent
            }
        }
        Slider{
            id:slider
            anchors.left:timeLabel.right
            anchors.top : timeLabel.top
            height:timeLabel.height
            width:player.width-70-70
            from:0
            to:duration
            value:0
            property var isPress:0
            handle: Rectangle {
                radius: 10 // 设置手柄边角半径
                border.color: "gray"
                color: "lightgray"
            }

            onPressedChanged: {
                if(player.setSeek(slider.value) != 0)
                    return ;
                isPress++
                isPress%=2
                curSec = slider.value
                console.log("seek:", slider.value)
            }
        }
        Button {

            id:endtime
            anchors.left:slider.right
            anchors.top : slider.top
            width: 70
            height: parent.height/3
            text:curTime
            background: Rectangle{
                anchors.fill: parent
            }
        }

        Button{
            id:playBtn
            anchors.top: timeLabel.bottom
            x:parent.x+10
            width: 35
            height: 35

            background: Rectangle {
                id:playBg
                radius: 4
            }

            contentItem: Image {

                id:btnStartPlayIcon
                source: "image/play0.png"
                fillMode: Image.PreserveAspectFit
                scale: 1.0
            }

            MouseArea {
                hoverEnabled:true
                anchors.fill: parent

                onEntered: {

                    if(player.getPlaying() === false || comboBox.isFramePlay() == true)
                        return ;
                    if(player.getIsPause() === true)
                    {
                        btnStartPlayIcon.source = "image/play.png"
                    }else{
                        btnStartPlayIcon.source = "image/pause.png"
                    }
                }
                onExited: {
                    if(player.getPlaying() === false|| comboBox.isFramePlay() == true)
                        return ;
                    if(player.getIsPause() === true)
                    {
                        btnStartPlayIcon.source = "image/play0.png"
                    }else{
                        btnStartPlayIcon.source = "image/pause0.png"
                    }
                }
                onClicked:{

                    if(player.getPlaying() ===false)
                        return

                    if(comboBox.isFramePlay() == true){
                        player.displayNextFrame();
                        return ;
                    }
                    var isPause = player.getIsPause();
                    player.togglePause();

                    if(isPause === true)
                        btnStartPlayIcon.source = "image/play0.png"
                    else
                        btnStartPlayIcon.source = "image/pause0.png"
                }
                onReleased: {
                    btnStartPlayIcon.scale = 1.0

                }
                onPressed: {
                    btnStartPlayIcon.scale = 0.9

                }
            }
        }

        Button{
            id:stopBtn
            anchors.top: timeLabel.bottom
            x:playBtn.width+playBtn.x-3
            width:  35
            height: 35//bottomrec.height-timeLabel.height-5
            background: Rectangle {
                width: 13
                height: 13
                id:stopBg
                radius: 4
                border.color: "gray"
                color:"gray"
                anchors.centerIn: stopBtn
            }

            MouseArea {
                hoverEnabled:true
                anchors.fill: parent
                onEntered: {
                    if(player.getPlaying() === false)
                        return ;
                }
                onExited: {
                    if(player.getPlaying() === false)
                        return ;
                }

                onClicked:{
                    if(player.getPlaying() === false)
                        return
                    player.stopPlay();
                }

                onReleased: {
                    stopBg.width = 13
                    stopBg.height = 13

                }
                onPressed: {
                    stopBg.width = 11
                    stopBg.height = 11
                }
            }
        }
        Button{
            id:exportBtn
            width:40
            height:35
            x:stopBtn.width+stopBtn.x-3
            anchors.top: timeLabel.bottom

            contentItem: Image {

                id:exportIcon
                source: "image/record.png"
                fillMode: Image.PreserveAspectFit
                scale: 1.3
            }
            background: Rectangle{
                id:exportBg
            }
            property var is_enable:false
            MouseArea {
                hoverEnabled:true
                anchors.fill: parent

                onClicked: {
                    if(player.getPlaying() == false)
                        return;
                    var isRecord = player.getRecord();
                    console.log(isRecord)
                    if(isRecord === true){
                        exportIcon.source = "image/record.png"
                        exportIcon.scale=1.3
                    }else{
                        exportIcon.source = "image/recording.png"
                        exportIcon.scale=0.7
                    }
                    player.setRecord()
                }
                onReleased: {
                    exportIcon.scale = 1.3;

                }
                onPressed: {
                    exportIcon.scale = 1.1;
                }
            }
        }
        ComboBox {
            anchors.top: timeLabel.bottom
            x:exportBtn.x+exportBtn.width+3
            id: comboBox
            width: 80
            height: bottomrec.height-timeLabel.height-5
            currentIndex:0

            function isFramePlay()
            {
                if(currentIndex == 4)
                    return true

                return false
            }

            background: Rectangle{
                id:comboBoxBg
            }
            property var prevIndex:0;
            property var arrays:[1,2,4,0.5,0]
            model: ListModel {

                ListElement { text: "1倍速" }
                ListElement { text: "2倍速" }
                ListElement { text: "4倍速" }
                ListElement { text: "0.5倍速" }
                ListElement { text: "逐帧播放" }
            }

            // 设置下拉列表项的样式
            delegate: ItemDelegate {
                width: parent.width
                height: 30
                contentItem: Text {
                    text: model.text
                    color: "#333"
                    font.pixelSize: comboBox.font.pixelSize
                    elide: Text.ElideRight
                    verticalAlignment: Text.AlignVCenter
                    horizontalAlignment: Text.AlignHCenter
                }
                background: Rectangle {
                    color: model.hovered ? "#ddd" : "#fff"
                    border.color: "#ddd"
                }
            }

            // 设置下拉箭头样式
            indicator: Canvas {
                visible: false
            }

            // 当选中项改变时输出信息
            onCurrentIndexChanged: {
                if(player.getPlaying() == false)
                {
                    currentIndex = 0
                    console.log("rerere:",player.getPlaying())
                    return
                }
                console.log("cur:",comboBox.arrays[currentIndex])
                console.log("prev:",comboBox.arrays[prevIndex])

                if(comboBox.arrays[currentIndex] == 0) // 逐帧播放
                {
                    if(player.displayNextFrame() != 0){
                        currentIndex = prevIndex
                        return
                    }
                    prevIndex = currentIndex
                    return
                }

                if(comboBox.arrays[prevIndex] == 0) // 点击了倍速播放，且当前状态是逐帧播放，先接触暂停状态，在设置速度
                {
                    console.log("unpause:", comboBox.arrays[prevIndex])
                    player.togglePause()
                }

                if(player.setSpeed(comboBox.arrays[currentIndex]) == 0)  // 倍速播放
                {
                    console.log("set prev:", prevIndex)
                    prevIndex = currentIndex
                }else{
                    currentIndex = prevIndex
                }
            }
        }
    }
}
